<template>
  <div class="noticeBaseBox">
    <h2>{{ noticeObj.title }}</h2>
    <span>{{ noticeObj.publishTime }}</span>
    <p>摘要 {{ noticeObj.summary }}</p>
    <div class="html" v-html="noticeObj.content">
    </div>
    <div class="footer">
      <b class="button-w" @click="readed">已阅</b>
    </div>
  </div>
</template>
<script type="text/ecmascript-6">
export default {
  name: 'noticeBase',
  props: {
    noticeId: {
      type: String
    }
  },
  data () {
    return {
      noticeObj: ''
    }
  },
  methods: {
    getDetail () { // 获取公告详情
      this.$ajax.post('/api/notice/getNoticeContentByNoticeId', {
        noticeId: this.$route.query.noticeId || this.noticeId
      }).then((data) => {
        if (data.data.code === '200') {
          let res = data.data.data
          this.noticeObj = res
        } else {
          this.$message({
            message: data.data.message,
            type: 'warning'
          })
        }
      }).catch((err) => {
        console.error(err)
        this.$message({
          message: '生意太火爆了, 请稍后再试',
          type: 'error'
        })
      })
    },
    readed () {
      this.$emit('readed')
    }
  },
  created () {
    this.getDetail()
  }
}
</script>
<style lang="stylus" rel="stylesheet/stylus" scoped>
@import '../../../../assets/stylus/index.styl'
.noticeBaseBox
  padding 24px 0 40px
  background #ffffff
  >h2
    fontSize(24px, 1, $fontColor)
    margin-bottom 24px
  >span
    fontSize($fontSize, 1, $fontColor)
  >p
    margin-top 24px
    border 1px solid #DEDEDE
    border-radius 4px
    background #F8F8F8
    line-height 40px
    padding 0 8px
    fontSize($fontSize-m, 40px, $fontColor)
  .html
    margin 12px 0
  .footer
    margin-top 100px
    text-align center
</style>
